<%--
  Created by IntelliJ IDEA.
  User: admin
  Date: 2021/12/14
  Time: 11:46
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<el-card>
    <el-row style="width: 100%">
        <el-col :md="{span:8}" style="margin-bottom: 5px">
            <el-date-picker
                    v-model="managerCreditCard.dataRange"
                    type="daterange"
                    range-separator="To"
                    start-placeholder="开始时间"
                    end-placeholder="结束时间"
                    value-format="YYYY-MM-DD"
                    style="width: 100%"
            >
            </el-date-picker>
        </el-col>
        <el-col :md="{span:6,offset:4}" style="margin-bottom: 5px">
            <el-select v-model="managerCreditCard.bankId" placeholder="银行名称" style="width: 110px;margin-right: 5px">
                <el-option label="选择银行" value=""></el-option>
                <el-option
                        v-for="(item,index) in BankMsgAll"
                        :key="index"
                        :label="item.bankName" :value="item.bankId"></el-option>
            </el-select>
            <el-select v-model="managerCreditCard.isPay" placeholder="是否还款" style="width: 110px">
                <el-option label="是否还款" value=""></el-option>
                <el-option label="已还款" value="2"></el-option>
                <el-option label="未还款" value="1"></el-option>
            </el-select>
        </el-col>
        <el-col :md="{span:6}" style="margin-bottom: 5px">
            <el-input
                    v-model="managerCreditCard.search"
                    placeholder="请输入内容"
                    style="width: 100%"
            >
                <template #prepend>
                    <el-select v-model="managerCreditCard.searchCon" style="width: 110px">
                        <el-option label="卡号" :value="1"></el-option>
                        <el-option label="手机号" :value="2"></el-option>
                    </el-select>
                </template>
                <template #append>
                    <el-button @click="loadManagerCreditCard(1)">
                        <el-icon>
                            <i class="fa fa-search"></i>
                        </el-icon>
                    </el-button>
                </template>
            </el-input>
        </el-col>
    </el-row>
    <el-table :data="managerCreditCard.tableData" style="width: 100%">
        <el-table-column prop="cardId" label="信用卡ID"></el-table-column>
        <el-table-column prop="cardNumId" label="信用卡卡号"></el-table-column>
        <el-table-column prop="cardPrice" label="代还款金额"></el-table-column>
        <el-table-column prop="cardTime" label="还款日期"></el-table-column>
        <el-table-column prop="bankName" label="银行名称"></el-table-column>
        <el-table-column prop="cardState" label="是否还款">
            <template #default="scope">
                {{ scope.row.cardState===1?"未还款":"已还款" }}
            </template>
        </el-table-column>
        <el-table-column prop="userTelPhone" label="用户手机"></el-table-column>
    </el-table>
    <el-pagination style="text-align: center" layout="prev, pager, next" :total="managerCreditCard.itemsCount"
                   :page-size="10" @current-change="tabManagerCreditCardPage"></el-pagination>
</el-card>